import React, {Component} from 'react';
import queryString from 'query-string'
import 'whatwg-fetch'
import './login.css'

class Login extends Component {
    constructor(props) {
        super(props)
        document.title = '登录'
        if(props.location.search && props.location.search !== undefined ){
            let openId = props.location.search.substring(props.location.search.indexOf('=')+1,props.location.search.length)
            this.state = {openId: openId,mokeData:''}
        }else{
            this.state = {openId:null,mokeData:''}
        }
    }
    Login(){
        let url = '/wx/wxs/login'
        let param ={name : 'lhy' , password:'123456',openId:this.state.openId}
        　fetch(`${url}?${queryString.stringify(param)}`,{headers:{
            'Content-Type': 'application/json'
        },
            mode: 'cors'}).then((res)=>{
             //这里面的东西是fetch自带的
            if(res.status !== 200){
                alert("用户名或者密码不正确")
                return;
            }else{
                return res.json()
            }
        }).then((res)=>{
            //这里面的东西 就是 后台饭给我的json对象
             if(res.code === 0){
                 alert("正确")
                 this.setState({
                     mokeData:'成功'
                 })
                // this.props.history.push('/wx/index')
             }else if(res.code === -2){
                 alert("用户名或密码不正确")
             }
         })
    }
    render() {
        return (
            <div className='mormal-font login'>
                {/*这个mokedate是渲染数据的例子*/}

                {/**/}
                <div><img src={require('../../assets/head.png')} alt='' className='login-head'/></div>

                    <form className='login-form gray'>
                        <div><label>手机号码</label><input type='text' className='login-tel-input'/></div>
                        <div><label>验证码</label><input type='text' /><span>|</span><span className='receive-code'>获取验证码</span></div>
                    </form>


                <button className='login-button mormal-font' onClick={this.Login.bind(this)}>登录</button>
            </div>
        )
    }

}
export default Login